<!DOCTYPE html>
<html>
  <head>
    <style></style>
  </head>
  <body>
    <p>Take a look at the source code. Output is logged to the developer console.</p>
    <!-- ES Module -->
    <script type="module">
      // import { Vex, Flow, StaveNote } from '../../build/esm/entry/vexflow.js';
      import { Vex, Flow, StaveNote } from '../../build/esm/entry/vexflow-debug.js';
      // import { Vex, Flow, StaveNote, ArticulationTests } from '../../build/esm/entry/vexflow-debug-with-tests.js';
      // import { Vex, Flow, StaveNote } from '../../build/esm/entry/vexflow-bravura.js';
      // import { Vex, Flow, StaveNote } from '../../build/esm/entry/vexflow-gonville.js';
      // import { Vex, Flow, StaveNote } from '../../build/esm/entry/vexflow-petaluma.js';
      // import { Vex, Flow, StaveNote } from '../../build/esm/entry/vexflow-core.js';
      console.log(Vex);
      console.log(Flow);
      console.log(StaveNote);
    </script>

    <!-- CJS: The script tags below assign their default export to window.Vex. -->
    <!-- <script src="../../build/cjs/vexflow.js"></script> -->
    <script src="../../build/cjs/vexflow-debug.js"></script>
    <!-- <script src="../../build/cjs/vexflow-debug-with-tests.js"></script> -->
    <!-- <script src="../../build/cjs/vexflow-bravura.js"></script> -->
    <!-- <script src="../../build/cjs/vexflow-gonville.js"></script> -->
    <!-- <script src="../../build/cjs/vexflow-petaluma.js"></script> -->
    <!-- <script src="../../build/cjs/vexflow-core.js"></script> -->
    <script>
      const { Vex, Flow, StaveNote } = window.Vex;
      console.log(Vex);
      console.log(Flow);
      console.log(StaveNote);
    </script>
  </body>
</html>
